import React from 'react';
import styles from './index.less';
import { Card, List, Tag } from 'antd';
import { Link } from 'umi';
import moment from 'moment';

/* 动态 */
class News extends React.Component {
  constructor(props) {
    super(props);
  }

  getStatusTag = (stauts) => {
    let tag = null;
    switch (stauts) {
      case 1:
        tag = <Tag color="red">借</Tag>;
        break;
      case 2:
        tag = <Tag color="green">还</Tag>;
        break;
      case 3:
        tag = <Tag color="blue">到</Tag>;
        break;
      default:
        break;
    }
    return tag
  }

  render() {
  
    const list = this.props.list.slice(0, 6);
    return (
      <Card
        style={{ marginBottom: 24 }}
        title="动态"
        bordered={false}
        extra={<Link to="/">更多</Link>}
        bodyStyle={{height: 290, padding: 0 }}>
        <List
          className={styles.newsList}
          itemLayout="horizontal"
          dataSource={list}
          renderItem={(item) => (
            <List.Item key={item.operateTime}>
              <div className={styles.item}>
                {this.getStatusTag(item.operateType)}
                <Link to='/' className={styles.title}>{item.readerName}  《{item.bookName}》</Link>
              </div>
              <div className={styles.datetime}>{moment(item.operateTime).fromNow()}</div>
            </List.Item>
          )}
        />
      </Card>
    );
  }
}

export default News;
